<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>后台管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="../../css/font.css">
    <link rel="stylesheet" href="../../css/xadmin.css">
    <script type="text/javascript" src="../../js/jquery-3.2.1.js"></script>
    <script type="text/javascript" src="../../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../../js/xadmin.js"></script>
    <style type="text/css">
        .ui-ma{
            display:block;
            margin: auto;
        }
    </style>
  </head>
  
  <body>
    <div class="x-body">
        <table id="Table" lay-filter="test"></table>
    </div>
    <script type="text/html" id="toolbarDemo" >
			<a class="layui-btn layui-btn-sm" lay-event="addkey">增加钥匙</a>
		</script>
    <script type="text/html" id="barDemo">

  <div class="layui-row">
    <div class="layui-col-xs3">
      <a class="layui-btn layui-btn-xs ui-ma {{#  if(d.isLend == 1 ){ }} layui-btn-primary layui-disabled {{# } }} " lay-event="lend" style="border: 1px solid ;">借出</a>
    </div>
    <div class="layui-col-xs6">
      <a class="layui-btn layui-btn-xs ui-ma " lay-event="record">借出记录</a>
    </div>
    <div class="layui-col-xs3">
      <a class="layui-btn layui-btn-danger layui-btn-xs ui-ma {{#  if(d.isLend == 1 ){ }} layui-btn-primary layui-disabled {{# } }} " lay-event="del">删除</a>
    </div>
  </div>

		</script>
    <script>
    layui.use(['table', 'layer'], function() {
        layer = layui.layer;
        table = layui.table;
        
        var data = {enable:1};
        if(window.location.href.indexOf("?")!=-1){
            var para =  window.location.href.substr(window.location.href.indexOf("?")+1);
            if(para != null && para != undefined && para.trim() != ''){
                para = para.replace(/=/g,"':'");
                para = para.replace(/&/g,"','");
                data = $.extend({},data,eval("({'"+para+"'})"));
               // data = JSON.parse('{'+para+'}');
                console.log(data);
                console.log(para);
            }
        }
        table.render({
            elem: '#Table'
            ,id: 'keyTable'
            ,height: 605
            ,width:800
            ,url: '../findRoomKey' //数据接口
            ,where : data
						,page: {limits:[10, 20, 30]} //开启分页
            ,toolbar: '#toolbarDemo' //开启工具栏
            ,request: {
                pageName: 'pageNo' //页码的参数名称，默认：page
                ,limitName: 'pageSize' //每页数据量的参数名，默认：limit
            }
            ,cols: [[ //表头
              {field: 'keyId', title: '钥匙ID', width:100,  fixed: 'left'}
              ,{field: 'blgRoomId', title: '房间ID', width:150, sort: true, fixed: 'left'}
              ,{field: 'state', title: '借出', width:120, sort: true, fixed: 'left'
              		,templet:function(d){
              			if(d.isLend==1){
              				return '是';
              			}
              			return '否';
              		}
              }
              ,{fixed: 'right', title: '操作', width: 165,templet:'#barDemo'}
            ]]
       });
        
        //头工具栏事件
          table.on('toolbar(test)', function(obj){
              var data = obj.data;
                if(obj.event === 'addkey'){
                	 if(data != undefined && data != null ){
                		 if(data.blgRoomId != undefined && data.blgRoomId != null && data.blgRoomId.trim() != ''){
                			 x_admin_show('增加钥匙','./key-add.html?blgRoomId='+data.blgRoomId);
                		 }
                	 }else{
                		 x_admin_show('增加钥匙','./key-add.html');
                	 }
                } 
          });   
        
         //监听行工具事件
    table.on('tool(test)', function(obj){
            var data = obj.data;
            if(obj.event === 'lend'){
              x_admin_show('借出钥匙','./key-lend.html?keyId='+data.keyId);
            } else if(obj.event === 'record'){
            	x_admin_show('钥匙借出记录','./key-record.html?keyId='+data.keyId);
            }else if(obj.event === 'del'){
            	$.ajax({
                	type:"post",
                	url:"../updateRoomKey",
                	async:true,
                	data:{keyId:data.keyId,enable:0},
                	success:function(result){
                		layer.alert("操作成功", {icon: 1});
                		location.reload();
                	},
                	error : function(){layer.alert("与服务器连接异常", {icon: 2});}
                });
            }
    });
});
    </script>

  </body>

</html>